<template>
  <div class="choiceCarriage">
    <van-nav-bar title="确认承运" @click-right="onClickRight" @click-left="onClickLeft" fixed>
      <van-icon name="arrow-left" slot="left" color="#333" size="0.6rem" />
      <van-icon :name="require('@/assets/img/computer.png')" slot="right" color="#333" size="0.6rem" />
    </van-nav-bar>
    <div class="searchCarriage">
      <van-search v-model="value" show-action placeholder="请输入" @input="onSearch">
        <div slot="action" @click="onSure">确定</div>
      </van-search>
    </div>
    <div class="rowresult" v-if="isSearch">
      <template v-if="data==''">
        <span class="flog">暂无数据</span>
      </template>
      <van-row v-for="(i,index) in data" :key="index" class="row" @click='backpage(i)'>
        <van-col span="4" class="no">{{index+1}}</van-col>
        <van-col span="8" class="van-ellipsis">{{i.kaCarrierCompanyName}}</van-col>
        <van-col span="5" class="van-ellipsis">{{i.kaCarrierContactName}}</van-col>
        <van-col span="7" class="van-ellipsis">{{i.kaCarrierContactMobile}}</van-col>
      </van-row>
    </div>
  </div>
</template>
<script>
import Vue from 'vue';
import { Search } from 'vant';
import { kaCarrier } from '@/api/order';
import { Col, Row } from 'vant';

Vue.use(Col);
Vue.use(Row);

Vue.use(Search);
export default {
  data() {
    return {
      value: '',
      isshowSearch: false,
      serachTxt: '',
      data: [],
      isSearch: false,
      carriage: false,
      changecarriage: false,
      list: []
    };
  },
  beforeRouteEnter(to, from, next) {
    let carriage = false;

    let changecarriage = false;

    if (from.path === '/carriage') {
      carriage = true;
    }
    if (from.path === '/change/carriage') {
      changecarriage = true;
    }
    next((vm) => {
      vm.carriage = carriage;
      vm.changecarriage = changecarriage;
      console.log(vm);
    });
  },
  mounted() {
    this.timer = setTimeout(() => { //设置延迟执行
      this.getData();
    }, 1000);
  },
  methods: {
    getData() {
      console.log(this.carriage);
      console.log(this.changecarriage);
      if (this.carriage) {
        let data = sessionStorage.getItem('carriage');

        this.list = JSON.parse(data);
        console.log('carriage');
      }
      if (this.changecarriage) {
        let data = sessionStorage.getItem('bd-h5-selectcarrier');

        this.list = JSON.parse(data);
        console.log('来自change页面');
      }
    },
    onClickRight () {
       let url = window.location.host; 
       
      let index = url.indexOf("pre");

     if (index<=-1) {
          window.location.href ="https://ka.lecarlink.com/index.aspx";    
      } else {
          window.location.href = "https://ka-pre.lecarlink.com/index.aspx";
      }
    },
    onSearch(val) {
      this.serachTxt = val;
      this.isshowSearch = false;
      this.isSearch = true;
      console.log(val);
      if (this.serachTxt == '') {
        this.$toast('搜索关键词不能为空');
      } else {
        kaCarrier({
          kaCarrierLikeName: val
        }).then(res => {
          console.log(res);
          this.data = res.data;
        });
      }
    },
    onClickLeft() {
      this.$router.back();
    },
    onSure() {
      if (this.data == '' && this.value != '') {
        this.list.kaCarrierCompanyName = this.value;
        if (this.carriage) {
          sessionStorage.setItem('carriage', JSON.stringify(this.list));
        }
        if (this.changecarriage) {
          sessionStorage.setItem('bd-h5-selectcarrier', JSON.stringify(this.list));
        }
        this.$router.back();
      }
    },
    showSearch() {
      this.isshowSearch = true;
    },
    backpage(val) {
      //console.log(val)
      this.list.kaCarrierCompanyName = val.kaCarrierCompanyName;
      this.list.kaCarrierContactName = val.kaCarrierContactName;
      this.list.kaCarrierContactMobile = val.kaCarrierContactMobile;
      this.list.kaCarrierId = val.kaCarrierId;
      console.log(this.list);
      if (this.carriage) {
        sessionStorage.setItem('carriage', JSON.stringify(this.list));
      }
      if (this.changecarriage) {
        sessionStorage.setItem('bd-h5-selectcarrier', JSON.stringify(this.list));
      }
      // localStorage.setItem('carrierall', JSON.stringify(val));
      this.$router.back();
    }
  }
};
</script>
<style lang='scss'>
.searchCarriage {
  padding-top: 45px;
}

.rowresult {
  padding: 10px 16px 0 16px;
  font-size: 16px;
  /deep/ .row {
    height: 30px;
    line-height: 30px;
    border-bottom: 1px solid #ccc;
    background: #fff;
  }
  .no {
    text-align: center;
  }
  .flog {
    width: 100%;
    display: block;
    text-align: center;
  }
}
</style>

